<template>
	<div class="">
		
		<div  style="height: 100vh;width: 100vw;overflow-y: overlay;overflow-x: visible;min-width: 1440px;" ref="scroll" class="wrapper">
			<div class="d1-3" id="top">
				<div style="width: 1440px;margin: auto;height: 90px;margin: auto;min-width: 1440px;">

					<div style="display: inline-block;width: 216px;line-height: 90px;height: 90px;vertical-align: top;cursor: pointer;" @click="goHome()">
							<img src="../img/header.png" style=" width: 216px;">
					</div>
					<div style="display: inline-block;width:1224px;height: 100%;" v-if="!expert">
						<ul class="ul1" v-for="(item,index) in $router.options.routes" :index="index+''" v-if="item.show" style="width: 100%;">
							<li v-for="(item2,index2) in item.children" :index="item2.path" v-if="item2.show" style="width: 7%;">
								<router-link :to="{path:item2.path}" rel="opener" target="_blank"
									:class="$route.path==item2.path?'is-active':'not-active'">{{item2.name}}</router-link>
							</li>
							<li style="width: 9%;" v-if="!userbolean"  v-show="true">
								<i class="el-icon-user-solid"
										style="color: #ff7f50;margin-right: 3%;font-size: 20px;"></i>
								<el-dropdown trigger="click" style="font-size: 15px;margin-left: 5px;">
									<span class="el-dropdown-link" style="cursor: pointer;">
										登录
										<i class="el-icon-caret-bottom el-icon--right"></i>
									</span>
									<el-dropdown-menu slot="dropdown">
										<el-dropdown-item class="clearfix" style="padding: 0;width:80px;">
											<span @click="toSigninx()" style="display: inline-block;width: 100%;text-align: center;">学生端登录</span>
											<!-- <el-badge class="mark" /> -->
										</el-dropdown-item>
										<el-dropdown-item class="clearfix" style="padding: 0;width:80px;">
											<span @click="toSignin()" style="display: inline-block;width: 100%;text-align: center;">指导师登录</span>
											<!-- <el-badge class="mark" /> -->
										</el-dropdown-item>
									</el-dropdown-menu>
								</el-dropdown>
							</li>
							<li style="width:12%;" v-if="userbolean">
								<i class="el-icon-user-solid" style="color: #ff7f50;font-size: 20px;"></i>
								<el-dropdown trigger="click" style="font-size: 15px;margin-left: 5px;">
									<span class="el-dropdown-link">
										<span class="username">{{user.nickName}}</span>
										<i class="el-icon-caret-bottom el-icon--right"></i>
									</span>
									<el-dropdown-menu slot="dropdown">
										<el-dropdown-item class="clearfix" style="padding: 0;width:80px;">
											<a href="https://open.weixin.qq.com/connect/qrconnect?appid=wx300c5c2045683f30&redirect_uri=http://www.51mydoor.com&response_type=code&scope=snsapi_login&state=STATE#wechat_redirect" style="display: inline-block;width: 100%;text-align: center;color: #606266;">
											绑定微信
											</a>
											<el-badge class="mark" />
										</el-dropdown-item>
										<el-dropdown-item class="clearfix" style="padding: 0;width:80px;">
											<span @click="logout()" style="display: inline-block;width: 100%;text-align: center;">退出登录</span>

											<el-badge class="mark" />
										</el-dropdown-item>
									</el-dropdown-menu>
								</el-dropdown>
							</li>
						</ul>
					</div>
					<div style="display: inline-block;width:1224px;height: 100%;" v-if="expert">
						<ul class="ul1" v-for="(item,index) in $router.options.routes" :index="index+''" v-if="item.show" style="width: 100%;">
							<li v-for="(item2,index2) in item.children" :index="item2.path" v-if="item2.expert" style="width: 7%;">
								<router-link :to="{path:item2.path}" rel="opener" target="_blank"
									:class="$route.path==item2.path?'is-active':'not-active'">{{item2.name}}</router-link>
							</li>
							<li style="width: 9%;" v-if="!userbolean"  v-show="true">
								<i class="el-icon-user-solid"
										style="color: #ff7f50;margin-right: 3%;font-size: 20px;"></i>
								<el-dropdown trigger="click" style="font-size: 15px;margin-left: 5px;">
									<span class="el-dropdown-link" style="cursor: pointer;">
										登录
										<i class="el-icon-caret-bottom el-icon--right"></i>
									</span>
									<el-dropdown-menu slot="dropdown">
										<el-dropdown-item class="clearfix" style="padding: 0;width:80px;">
											<span @click="toSigninx()" style="display: inline-block;width: 100%;text-align: center;">学生端登录</span>
										</el-dropdown-item>
										<el-dropdown-item class="clearfix" style="padding: 0;width:80px;">
											<span @click="toSignin()" style="display: inline-block;width: 100%;text-align: center;">指导师登录</span>
										</el-dropdown-item>
									</el-dropdown-menu>
								</el-dropdown>
							</li>
							<li style="width: 12%;" v-if="userbolean">
								<i class="el-icon-user-solid" style="color: #ff7f50;font-size: 20px;"></i>
								<el-dropdown trigger="click" style="font-size: 15px;margin-left: 5px;">
									<span class="el-dropdown-link">
										<span class="username">{{user.nickName}}</span>
										<i class="el-icon-caret-bottom el-icon--right"></i>
									</span>
									<el-dropdown-menu slot="dropdown">
										<el-dropdown-item class="clearfix" style="padding: 0;width:80px;">
											<span @click="logout()" style="display: inline-block;width: 100%;text-align: center;">退出登录</span>

											<el-badge class="mark" />
										</el-dropdown-item>
									</el-dropdown-menu>
								</el-dropdown>
							</li>
						</ul>
					</div>
				</div>
			</div>
			<router-view class="section" style="margin-top: 90px;"></router-view>
			<el-backtop target=".wrapper" :visibility-height="300" :bottom="150" :right="20" style="width: 50px;height: 50px;font-size: 15px;color:orangered;">
				<span style="font-size: 20px;">↑</span>顶部
			</el-backtop>
			<!-- <div class="div3" style="margin: auto;margin-top: 20px;">
				<div style="font-size: 12px;color: gray;display: inline-block;width: 1440px;border-bottom: 1px solid gray;line-height: 35px;height: 35px;text-align: left;">
					<a target="_blank" href="http://www.sneea.cn/" style="color: gray;">陕西省教育考试院</a> <a target="_blank" href="http://www.sneac.com/" style="margin-left: 20px;color: gray;">陕西招生考试信息网</a><a target="_blank" href="https://gaokao.chsi.com.cn/" style="margin-left: 20px;color: gray;">阳光高考|国家智慧教育公告服务平台</a>
					<a target="_blank" href="https://yz.chsi.com.cn/" style="margin-left: 20px;color: gray;">中国研究生招生信息网</a>
					<a target="_blank" href="https://www.shanghairanking.cn/" style="margin-left: 20px;color: gray;">软科高等教育评价</a>
					<a target="_blank" href="https://www.qschina.cn/" style="margin-left: 20px;color: gray;">QSChina</a>
				</div></br>
				<div style="color: gray;font-size: 12px;line-height: 35px;display: inline-block;text-align: left;width: 1440px;height: 35px;">
				<span style="display: inline-block;width: 74%;">
					门道生涯 | 你与更精彩的自己，只差一道门的距离！
					<span>联系电话：177 9120 5273（西安）、153 0917 5208（宝鸡）、130 9392 0312（汉中）、180 9124 4811（榆林）、181 9192 0705（渭南）</span>
				</span>

				<span style="text-align: right;display: inline-block;width: 26%;">

						<span @click="togxb()" style="cursor: pointer;margin-left: 20px;">陕ICP备19005241号-2</span>
						<img src="../img/beian.png" style="line-height: 35px;height: 20px; display: inline-block;vertical-align:middle;margin-left: 20px;"/>

						<a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=61019002002070" style="display:inline-block;text-decoration:none;height:20px;line-height:20px;"><img src="" style="float:left;"/><p style="height:20px;line-height:20px;margin: 0px 0px 0px 5px; color:#939393;">陕公网安备 61019002002070号</p></a>

					</span>
				</div>
			</div> -->

			<!--  footer 组件  -->
			<mFooter></mFooter>
		</div>
	</div>
</template>
<script>
	import {
		request
	} from "../util/request.js"
	import axios from 'axios'
	import VueResource from 'vue-resource';
	import mFooter from '@/components/mFooter';
	import layout from '@/layout';
console.log('layout', layout);
	export default {
		inject: ['reload'],
    components: { mFooter, layout },
		data() {
			return {
				url:'https://beian.miit.gov.cn/',
				user: {
				},
				wxid:null,
				userbolean:false,
				expert:true
			}
		},
		methods: {
			goHome(){
				this.$router.push("/")
			},
			togxb() {
			window.open(this.url)
			},
			toSignin(){
				this.$router.push({
					path:"/signin"
				})
			},
			toSigninx(){
				this.$router.push({
					path:"/signinx"
				})
			},
			logout(){
				// console.log("用户退出登录...")
				request({
					method: 'get',
					url: 'sysUser/logout'
				}).then(res => {
					if(res.code==null||res.code==0){
						sessionStorage.removeItem("satoken")
						sessionStorage.removeItem("user")
						this.userbolean=false
						// console.log("成功！")
					}
				})
				this.$store.commit('logout')
				this.user=null
				this.$router.push({ path: '/' });

			},
			wxlogin(){
				request({
					method: 'POST',
					url: 'sysUser/wxlogin',
					data: this.wxid
				}).then(msg => {
					if(msg.data.state===0){
						this.$message({
							message: "登录成功！",
							type: "success"
						});
						console.log("登录成功");
						this.reload();
						sessionStorage.setItem(msg.data.tokenInfo.tokenName, msg.data.tokenInfo.tokenValue)
						sessionStorage.setItem('user', JSON.stringify(msg.data.user[0]))
						this.$store.dispatch('login', msg.data)
						this.$router.push({
							path: '/',
							query:{}
						});
						// window.open("https://www.51mydoor.com", '_self ')
					}else{
						this.$alert('请先注册一个账号', '提示', {
						          confirmButtonText: '确定',
						          callback: action => {
									  this.activeName="second"
						          }
						        });
					}
				})
			},
			bdwx(){
				request({
					method: 'post',
					url: 'sysUser/bdwx',
					data: {
						openid:this.wxid,
						userId:this.user.userId
					}
				}).then(result => {
					if(result.code==0||result.code==200){
						this.$message({
							message: result.msg,
							type: "success"
						});
					}else{
						this.$message({
							message: result.msg,
							type: "error"
						});
					}
				})
			},
		},

	mounted() {

	},
	created() {
		const user = sessionStorage.getItem("user");
		this.user=JSON.parse(user);
		const zhi=location.search.slice(1).split("&")
		const code  =JSON.stringify(JSON.parse(JSON.stringify(zhi)))
		const code1=JSON.parse(code.split(','));
		const code2=JSON.stringify(code1[0]);
		const code3=code2.slice(6);
		const code4=code3.slice(0,code3.length-1);
		if(this.user!=null&&this.user.nickName!=null&&this.user.nickName!=""){
			this.userbolean=true
			if(this.user.userType==3){
				this.expert=true
			}else if(this.user.userType==4&&code4!=null&&code4!=undefined&&!this.user.openid){
				request({
					method: 'post',
					url: 'sysUser/getAccessToken',
					params: {
						code: code4
					}
				}).then(res => {
					const weix = JSON.parse(res.msg)
					if (weix.hasOwnProperty('openid')) {
						this.user=JSON.parse(user)
						this.wxid=weix.openid
						this.bdwx()
					}
				})
			}
		}else{
			if(code4!=null||code4!=undefined){
				request({
					method: 'post',
					url: 'sysUser/getAccessToken',
					params: {
						code: code4
					}
				}).then(res => {
					const weix = JSON.parse(res.msg)
					if (weix.hasOwnProperty('openid')) {
						this.user=JSON.parse(user)
						this.wxid=weix.openid
						this.wxlogin()
					}
				})
			}
		}

	},
	}
</script>

<style>
	.username{
		/* max-width:190px;
		overflow: visible;
		text-overflow: ellipsis;
		display: inline-block;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		verflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis; */
		/* overflow: hidden; */
		font-size: 14px;
		overflow: hidden;
		text-overflow: ellipsis;
		-o-text-overflow: ellipsis;
		white-space:nowrap;
		max-width:80px;
		height:52px;
		display:inline-block;
	}
	body::-webkit-scrollbar {display: none;}

	.d1-3 {
			width: 1440px;
			text-align: right;
			margin: 0 auto;
			align-items: center;
			border-bottom: 1px solid #e7eaed;
			min-width: 1440px;
		}
	.btnzf{
		width: 6.25rem;
		height: 1.875rem;
		border-radius: 0.3125rem;
		background-color: #ff7f50;
		color: white;border: none;
		margin-top: 3.125rem;
	}
	#app{
		/* position:absolute; */
		top:0;
		right:0;
		bottom:0;
		left:0;
	}
	#top{
		position:fixed;
		/* max-width: 1480px; */
		width: 100%;
		height: 90px;
		z-index: 999;
		top: 0;
		left:0;
		right:0;
		background-color: white;
	}
			 html,body{height: 100%;width: 100%;}
	        .wrapper{display: flex;flex-direction: column;min-height: 100%;max-width: 100%;}
	        .d1-3{flex: 0;}
	        .section{flex: 1;min-width: 1440px;left:0;
		right:0;}
	        .div3{flex: 0;}
</style>
